<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html";  charset="UTF-8" />
        <title>案例列表</title>
        <script type="text/javascript" src="../js/jquery/jquery.js">
        </script>
        <script type="text/javascript" src="../js/jquery/jquery-migrate.js">
        </script>
        <script type="text/javascript" src="../js/jqueryui/jquery-ui.js">
        </script>
        <script type="text/javascript" src="../js/ctp/public/jsextend.js">
        </script>
        <script type="text/javascript" src="../js/ctp/public/ctp.core.js">
        </script>
		<script type="text/javascript" src="../js/ctp/public/ctp.base.js"></script>
		<script type="text/javascript" src="../js/ctp/public/ctp.ui.component.js"></script>		
        <script type="text/javascript" src="../js/ctp/link/ctp.ui.link.js">
        </script>
        <script type="text/javascript" src="../js/ctp/image/ctp.ui.image.js">
        </script>
        <script type="text/javascript" src="../js/ctp/gridlayout/ctp.ui.gridlayout.js">
        </script>
        <script type="text/javascript" src="../js/ctp/textfield/ctp.ui.textfield.js">
        </script>
        <script type="text/javascript" src="../js/ctp/groupbox/ctp.ui.groupbox.js">
        </script>
        <script type="text/javascript" src="../js/ctp/treeview/jquery.cookie.js">
        </script>
        <script type="text/javascript" src="../js/ctp/treeview/jquery.treeview.js">
        </script>
        <script type="text/javascript" src="../js/ctp/treeview/ctp.ui.treeview.js">
        </script>
        <script type="text/javascript" src="../js/ctp/panel/ctp.ui.panel.js">
        </script>
        <link href="../css/skins/standard/ctp-common.css" rel="stylesheet" type="text/css"/>
        <link href="../css/link.css" rel="stylesheet" type="text/css"/>
        <link href="../css/image.css" rel="stylesheet" type="text/css"/>
        <link href="../css/gridlayout.css" rel="stylesheet" type="text/css"/>
        <link href='../css/panel.css' rel='stylesheet' type='text/css'/>
        <link href="../css/textfield.css" rel="stylesheet" type="text/css"/>
        <link href="../css/groupbox.css" rel="stylesheet" type="text/css"/>
        <link href='../css/panel.css' rel='stylesheet' type='text/css'/>
        <script>
            var imgWidth = '100%', imgHeight = '300px';
            var accordionArr = [], ajaxtreeArr = [], buttonArr = [], borderlayoutArr = [], chainArr = [],chartArr = [];
            var checkboxArr = [], checkboxgroupArr = [], colormenuArr = [], comboboxArr = [], datepickerArr = [];
            var fileuploadArr = [], formArr = [], gridArr = [], gridlayoutArr = [], groupboxArr = [], hwizardArr = [];
            var imageArr = [], labelArr = [], linkArr = [], listviewArr = [], mediaArr = [], menusArr = [];
            var messageboxArr = [], multiselectArr = [], panelArr = [], pictureshowArr = [], portalArr = [];
            var progressbarArr = [], radioArr = [], radiogroupArr = [], rteArr = [], statusbarArr = [];
            var tabletreeArr = [], tabsArr = [], textareaArr = [], textfieldArr = [], textslideArr = [];
            var toolbarArr = [], tooltipArr = [], treeviewArr = [], vwizardArr = [], zoomimageupArr = [];
            var mainPanel, navTree, navPanel, mainGridlayout;
            function createItem(itemsName, imgPath, itemtitle, objsArr){
                var link = new ctp.ui.link({
                    id: itemsName + 'Lk',
                    name: itemsName
                });
                var img = new ctp.ui.image({
                    id: itemsName + 'Img',
                    width: imgWidth,
                    height: imgHeight,
                    imgSrc: imgPath
                });
                var panel = new ctp.ui.panel({
                    id: itemsName + 'InfoPne',
                    width: '100%',
                    height: 'auto',
                    style: 'none',
                    html: itemsName + 'Info'
                });
                var gridlayout = new ctp.ui.gridlayout({
                    id: itemsName + 'Gl',
                    width: '90%',
                    align: 'center',
                    cols: 3,
                    items: [[{
                        colspan: 2,
                        element: img
                    }, {
                        element: panel
                    }]]
                });
                var groupbox = new ctp.ui.groupbox({
                    id: itemsName + 'Gb',
                    width: 'auto',
                    title: itemtitle,
                    items: [gridlayout]
                });
                objsArr.push(link);
                objsArr.push(groupbox);
            }
            
            $(document).ready(function(){
                /*
                 statusbar.showTime({//显示滚动条
                 statusObj: 'top.statusbar'//index1.jsp页面上状态条对象
                 });
                 */
                //accordion
                createItem('accordion', 'demoimages/accordion.jpg', '折叠框', accordionArr);
                //ajaxtree
                createItem('ajaxtree', 'demoimages/ajaxtree.jpg', '异步树', ajaxtreeArr);
                //button
                createItem('button', 'demoimages/button.jpg', '按钮', buttonArr);
                //borderlayout	
                createItem('borderlayout', 'demoimages/borderlayout.jpg', '边界布局', borderlayoutArr);
				//chain
                createItem('chain', 'demoimages/chain.jpg', '关联链', chainArr);
                //chart
                createItem('chart', 'demoimages/chart.jpg', 'flash图片生成', chartArr);
                //checkbox
                createItem('checkbox', 'demoimages/checkbox.jpg', '复选框', checkboxArr);
                //checkboxgroup
                createItem('checkboxgroup', 'demoimages/checkboxgroup.jpg', '复选框组', checkboxgroupArr);
                //colormenu
                createItem('colormenu', 'demoimages/colormenu.jpg', '颜色菜单', colormenuArr);
                //combobox
                createItem('combobox', 'demoimages/combobox.jpg', '下拉选择框', comboboxArr);
                //datepicker
                createItem('datepicker', 'demoimages/datepicker.jpg', '日历控件', datepickerArr);
                //fileupload
                createItem('fileupload', 'demoimages/fileupload.jpg', '文件上传', fileuploadArr);
                //form
                createItem('form', 'demoimages/form.jpg', '表单', formArr);
                //grid
                createItem('grid', 'demoimages/grid.jpg', '表格', gridArr);
                //gridlayout
                createItem('gridlayout', 'demoimages/gridlayout.jpg', '栅格布局', gridlayoutArr);
                //groupbox
                createItem('groupbox', 'demoimages/groupbox.jpg', '组', groupboxArr);
                //hwizard
                createItem('hwizard', 'demoimages/hwizard.jpg', '横向向导', hwizardArr);
                //image
                createItem('image', 'demoimages/image.jpg', '图片', imageArr);
                //label
                createItem('label', 'demoimages/label.jpg', '标签', labelArr);
                //link
                createItem('link', 'demoimages/link.jpg', '链接', linkArr);
                //listview
                createItem('listview', 'demoimages/listview.jpg', '列表', listviewArr);
                //media
                createItem('media', 'demoimages/media.jpg', '视频', mediaArr);
                //menus
                createItem('menus', 'demoimages/menus.jpg', '菜单', menusArr);
                //messagebox
                createItem('messagebox', 'demoimages/messagebox.jpg', '消息框', messageboxArr);
                //multiselect
                createItem('multiselect', 'demoimages/multiselect.jpg', '多选框', multiselectArr);
                //panel
                createItem('panel', 'demoimages/panel.jpg', '面板', panelArr);
                //pictureshow
                createItem('pictureshow', 'demoimages/pictureshow.jpg', '图片展示', pictureshowArr);
                //portal
                //createItem('portal', 'demoimages/portal.jpg', '拖动框', portalArr);
                //progressbar
                createItem('progressbar', 'demoimages/progressbar.jpg', '进度条', progressbarArr);
                //radio
                createItem('radio', 'demoimages/radio.jpg', '单选按钮', radioArr);
                //radiogroup
                createItem('radiogroup', 'demoimages/radiogroup.jpg', '单选按钮组', radiogroupArr);
                //rte
                createItem('rte', 'demoimages/rte.jpg', '富文本框', rteArr);
                //statusbar
                createItem('statusbar', 'demoimages/statusbar.jpg', '状态条', statusbarArr);
                //tabletree
                createItem('tabletree', 'demoimages/tabletree.jpg', '表树', tabletreeArr);
                //tabs
                createItem('tabs', 'demoimages/tabs.jpg', '多页标签', tabsArr);
                //textarea
                createItem('textarea', 'demoimages/textarea.jpg', '多行文本框', textareaArr);
                //textfield
                createItem('textfield', 'demoimages/textfield.jpg', '单行文本框', textfieldArr);
                //textslide
                createItem('textslide', 'demoimages/textslide.jpg', '文本滚动条', textslideArr);
                //toolbar
                createItem('toolbar', 'demoimages/toolbar.jpg', '工具条', toolbarArr);
                //tooltip
                createItem('tooltip', 'demoimages/tooltip.jpg', '提示框', tooltipArr);
                //treeview
                createItem('treeview', 'demoimages/treeview.jpg', '树', treeviewArr);
                //vwizard
                createItem('vwizard', 'demoimages/vwizard.jpg', '纵向向导', vwizardArr);
                //zoomimageup
                createItem('zoomimageup', 'demoimages/zoomimageup.jpg', '头像上传', zoomimageupArr);
                //mainPanel
                mainPanel = new ctp.ui.panel({
                    id: 'mainPanel',
                    width: '100%',
                    height: 'auto',
                    visible: 'visible',
                    style: 'none',
                    items: [accordionArr[0], accordionArr[1], ajaxtreeArr[0], ajaxtreeArr[1], buttonArr[0], buttonArr[1], borderlayoutArr[0], borderlayoutArr[1], chainArr[0], chainArr[1], chartArr[0], chartArr[1], checkboxArr[0], checkboxArr[1], checkboxgroupArr[0], checkboxgroupArr[1], colormenuArr[0], colormenuArr[1], comboboxArr[0], comboboxArr[1], datepickerArr[0], datepickerArr[1], fileuploadArr[0], fileuploadArr[1], formArr[0], formArr[1], gridArr[0], gridArr[1], gridlayoutArr[0], gridlayoutArr[1], groupboxArr[0], groupboxArr[1], hwizardArr[0], hwizardArr[1], imageArr[0], imageArr[1], labelArr[0], labelArr[1], linkArr[0], linkArr[1], listviewArr[0], listviewArr[1], mediaArr[0], mediaArr[1], menusArr[0], menusArr[1], messageboxArr[0], messageboxArr[1], multiselectArr[0], multiselectArr[1], panelArr[0], panelArr[1], pictureshowArr[0], pictureshowArr[1],progressbarArr[0], progressbarArr[1], radioArr[0], radioArr[1], radiogroupArr[0], radiogroupArr[1], rteArr[0], rteArr[1], statusbarArr[0], statusbarArr[1], tabletreeArr[0], tabletreeArr[1], tabsArr[0], tabsArr[1], textareaArr[0], textareaArr[1], textfieldArr[0], textfieldArr[1], textslideArr[0], textslideArr[1], toolbarArr[0], toolbarArr[1], tooltipArr[0], tooltipArr[1], treeviewArr[0], treeviewArr[1], vwizardArr[0], vwizardArr[1], zoomimageupArr[0], zoomimageupArr[1]]
                });
                navTree = new ctp.ui.treeview({
                    rootId: 'navigation',
                    url: 'demosnavtree.xml',
                    collapsed: true,
                    unique: false
                });
                navGb = new ctp.ui.groupbox({
                    id: 'navGb',
                    width: '300px',
                    title: '导航',
                    items: [navTree]
                });
                mainGridlayout = new ctp.ui.gridlayout({
                    id: 'mainGl',
                    width: '90%',
                    cols: 25,
                    align: 'center',
                    items: [[{
						colspan: 7,
                        element: navGb
                    }, {
                        colspan: 18,
                        element: mainPanel
                    }]],
                    renderTo: 'mainContainer'
                });
                //statusbar.endShow(true);
            });
        </script>
    </head>
    <body class="ctp-fs ctp-ff">
        <a name="navhead"></a>
        <div id="mainContainer">
        </div>
        <!--accordion-->
        <div id="accordionInfo">
            <a href="accordion/accordion.html" target="_blank"><H4>ctp.ui.accordion</H4></a>
            <a href="accordion/accordion.html" target="_blank">
                <P>
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--ajaxtree-->
        <div id="ajaxtreeInfo">
            <a href="ajaxtree/ajaxtree.html" target="_blank"><H4>ctp.ui.ajaxtree</H4></a>
            <a href="ajaxtree/ajaxtree.html" target="_blank">
                <P>
                    异步树，可拖动，可设置选择框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--button-->
        <div id="buttonInfo">
            <a href="button/button.html" target="_blank"><H4>ctp.ui.button</H4></a>
            <a href="button/button.html" target="_blank">
                <P>
                    按钮组件
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--borderlayout-->
        <div id="borderlayoutInfo">
            <a href="borderlayout/borderlayout.html" target="_blank"><H4>ctp.ui.borderlayout</H4></a>
            <a href="borderlayout/borderlayout.html" target="_blank">
                <P>
                    边界布局组件，可创建10种边界布局，并且支持布局嵌套
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--chain-->
        <div id="chainInfo">
            <a href="chain/chain.html" target="_blank"><H4>ctp.action.chain</H4></a>
            <a href="chain/chain.html" target="_blank">
                <P>
                    关联链
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--chart-->
        <div id="chartInfo">
            <a href="chart/chart.html" target="_blank"><H4>ctp.ui.chart</H4></a>
            <a href="chart/chart.html" target="_blank">
                <P>
                    图形生成组件：支持柱状、饼状、线状等图形化表现，同时支持2D、3D、动画效果等
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--checkbox-->
        <div id="checkboxInfo">
            <a href="checkbox/checkbox.html" target="_blank"><H4>ctp.ui.checkbox</H4></a>
            <a href="checkbox/checkbox.html" target="_blank">
                <P>
                    多选框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--checkboxgroup-->
        <div id="checkboxgroupInfo">
            <a href="checkboxgroup/checkboxgroup.html" target="_blank"><H4>ctp.ui.checkboxgroup</H4></a>
            <a href="checkboxgroup/checkboxgroup.html" target="_blank">
                <P>
                    多选框组
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--colormenu-->
        <div id="colormenuInfo">
            <a href="colormenu/colormenu.html" target="_blank"><H4>ctp.ui.colormenu</H4></a>
            <a href="colormenu/colormenu.html" target="_blank">
                <P>
                    颜色选择器
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--combobox-->
        <div id="comboboxInfo">
            <a href="combobox/combobox.html" target="_blank"><H4>ctp.ui.combobox</H4></a>
            <a href="combobox/combobox.html" target="_blank">
                <P>下拉框组件，可以通过URL获取到数据之后导入到下拉框组件去
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--datepicker-->
        <div id="datepickerInfo">
            <a href="datepicker/datepicker.html" target="_blank"><H4>ctp.ui.datepicker</H4></a>
            <a href="datepicker/datepicker.html" target="_blank">
                <P>日历组件
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--fileupload-->
        <div id="fileuploadInfo">
            <a href="fileupload/fileupload.html" target="_blank"><H4>ctp.ui.fileupload</H4></a>
            <a href="fileupload/fileupload.html" target="_blank">
                <P>
                    该组件实现将本地文件上传至服务器，支持多文件上传、文件类型过滤、最大上传文件数限制等
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--form-->
        <div id="formInfo">
            <a href="form/form.html" target="_blank"><H4>ctp.form</H4></a>
            <a href="form/form.html" target="_blank">
                <P>表单组件，放在表单里面的元素可进行数据验证，提交数据等
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--grid-->
        <div id="gridInfo">
            <a href="grid/grid.html" target="_blank"><H4>ctp.ui.grid</H4></a>
            <a href="grid/grid.html" target="_blank">
                <P>
                    数据表格组件，可通过该组件创建全量数据表格、翻页数据表格及可编辑数据表格，支持异步加载或提交数据，表头锁定，拖拉方式调整列宽，页面数据排序，按列筛选显示等功能
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--gridlayout-->
        <div id="gridlayoutInfo">
            <a href="gridlayout/gridlayout.html" target="_blank"><H4>ctp.ui.gridlayout</H4></a>
            <a href="gridlayout/gridlayout.html" target="_blank">
                <P>
                    该组件实现将各种组件按照行列形式整齐排列到某个页面容器中
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--groupbox-->
        <div id="groupboxInfo">
            <a href="groupbox/groupbox.html" target="_blank"><H4>ctp.ui.groupbox</H4></a>
            <a href="groupbox/groupbox.html" target="_blank">
                <P>组容器
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--hwizard-->
        <div id="hwizardInfo">
            <a href="hwizard/hwizard.html" target="_blank"><H4>ctp.ui.hwizard</H4></a>
            <a href="hwizard/hwizard.html" target="_blank">
                <P>
                    该组件实现将页面内容分步骤地呈现，能够方便地引导用户按照一定的步骤顺序来完成与程序的交互。
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--image-->
        <div id="imageInfo">
            <a href="image/image.html" target="_blank"><H4>ctp.ui.image</H4></a>
            <a href="image/image.html" target="_blank">
                <P>图片显示组件
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--label-->
        <div id="labelInfo">
            <a href="label/label.html" target="_blank"><H4>ctp.ui.label</H4></a>
            <a href="label/label.html" target="_blank">
                <P>标签
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--link-->
        <div id="linkInfo">
            <a href="link/link.html" target="_blank"><H4>ctp.ui.link</H4></a>
            <a href="link/link.html" target="_blank">
                <P>链接
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--listview-->
        <div id="listviewInfo">
            <a href="listview/listview.html" target="_blank"><H4>ctp.ui.listview</H4></a>
            <a href="listview/listview.html" target="_blank">
                <P>多行选择框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--media-->
        <div id="mediaInfo">
            <a href="media/media.html" target="_blank"><H4>ctp.ui.media</H4></a>
            <a href="media/media.html" target="_blank">
                <P>
                    多媒体播放器组件：支持多种格式的媒体文件播放器
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--menus-->
        <div id="menusInfo">
            <a href="menus/menus.html" target="_blank"><H4>ctp.ui.menus</H4></a>
            <a href="menus/menus.html" target="_blank">
                <P>菜单组件，可以设置多级菜单
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--messagebox-->
        <div id="messageboxInfo">
            <a href="messagebox/messagebox.html" target="_blank"><H4>ctp.ui.messagebox</H4></a>
            <a href="messagebox/messagebox.html" target="_blank">
                <P>
                    消息框组件：支持一般信息弹出框、确认弹出框、Iframe弹出框等，支持锁屏、拖动、最大最小化及回调函数等功能
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--multiselect-->
        <div id="multiselectInfo">
            <a href="multiselect/multiselect.html" target="_blank"><H4>ctp.ui.multiselect</H4></a>
            <a href="multiselect/multiselect.html" target="_blank">
                <P>
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--panel-->
        <div id="panelInfo">
            <a href="panel/panel.html" target="_blank"><H4>ctp.ui.panel</H4></a>
            <a href="panel/panel.html" target="_blank">
                <P>
                    面板容器类组件
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--pictureshow-->
        <div id="pictureshowInfo">
            <a href="pictureshow/pictureshow.html" target="_blank"><H4>ctp.ui.pictureshow</H4></a>
            <a href="pictureshow/pictureshow.html" target="_blank">
                <P>
                    幻灯片组件：支持多幅图片轮播、支持上下翻页自动播放
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--portal-->
		<!--
        <div id="portalInfo">
            <a href="portal/portal.html" target="_blank"><H4>ctp.ui.portal</H4></a>
            <a href="portal/portal.html" target="_blank">
                <P>多面板拖动组件，可让多个面板在同一个页面显示，并且进行拖动等动作
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
		-->
        <!--progressbar-->
        <div id="progressbarInfo">
            <a href="progressbar/progressbar.html" target="_blank"><H4>ctp.ui.progressbar</H4></a>
            <a href="progressbar/progressbar.html" target="_blank">
                <P>进度条
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--radio-->
        <div id="radioInfo">
            <a href="radio/radio.html" target="_blank"><H4>ctp.ui.radio</H4></a>
            <a href="radio/radio.html" target="_blank">
                <P>单选框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--radiogroup-->
        <div id="radiogroupInfo">
            <a href="radiogroup/radiogroup.html" target="_blank"><H4>ctp.ui.radiogroup</H4></a>
            <a href="radiogroup/radiogroup.html" target="_blank">
                <P>单选框组
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--rte-->
        <div id="rteInfo">
            <a href="rte/rte.html" target="_blank"><H4>ctp.ui.rte</H4></a>
            <a href="rte/rte.html" target="_blank">
                <P>文本编辑器
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--statusbar-->
        <div id="statusbarInfo">
            <a href="statusbar/statusbar.html" target="_blank"><H4>ctp.ui.statusbar</H4></a>
            <a href="statusbar/statusbar.html" target="_blank">
                <P>
                	状态显示
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--tabletree-->
        <div id="tabletreeInfo">
            <a href="tabletree/tabletree.html" target="_blank"><H4>ctp.ui.tabletree</H4></a>
            <a href="tabletree/tabletree.html" target="_blank">
                <P>
                    该组件可以将表元素扩展为具有树特点的树样表，能提高用户使用表格的体验，使操作更灵活、简便，并且能通过与其他组件配合实现更高级的功能。
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--tabs-->
        <div id="tabsInfo">
            <a href="tabs/tabs.html" target="_blank"><H4>ctp.ui.tabs</H4></a>
            <a href="tabs/tabs.html" target="_blank">
                <P>多页标签
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--textarea-->
        <div id="textareaInfo">
            <a href="textarea/textarea.html" target="_blank"><H4>ctp.ui.textarea</H4></a>
            <a href="textarea/textarea.html" target="_blank">
                <P>多行输入框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--textfield-->
        <div id="textfieldInfo">
            <a href="textfield/textfield.html" target="_blank"><H4>ctp.ui.textfield</H4></a>
            <a href="textfield/textfield.html" target="_blank">
                <P>文本输入框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--textslide-->
        <div id="textslideInfo">
            <a href="textslide/textslide.html" target="_blank"><H4>ctp.ui.textslide</H4></a>
            <a href="textslide/textslide.html" target="_blank">
                <P>
                    字幕滚动组件：支持文本字幕多方向、多方式滚动，可设置滚动速度等
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--toolbar-->
        <div id="toolbarInfo">
            <a href="toolbar/toolbar.html" target="_blank"><H4>ctp.ui.toolbar</H4></a>
            <a href="toolbar/toolbar.html" target="_blank">
                <P>工具栏
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--tooltip-->
        <div id="tooltipInfo">
            <a href="tooltip/tooltip.html" target="_blank"><H4>ctp.ui.tooltip</H4></a>
            <a href="tooltip/tooltip.html" target="_blank">
                <P>信息提示框
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--treeview-->
        <div id="treeviewInfo">
            <a href="treeview/treeview.html" target="_blank"><H4>ctp.ui.treeview</H4></a>
            <a href="treeview/treeview.html" target="_blank">
                <P>同步树，只支持XML格式的树状结构的显示
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--vwizard-->
        <div id="vwizardInfo">
            <a href="vwizard/vwizard.html" target="_blank"><H4>ctp.ui.vwizard</H4></a>
            <a href="vwizard/vwizard.html" target="_blank">
                <P>
                    该组件实现将页面内容分步骤地呈现，能够方便地引导用户按照一定的步骤顺序来完成与程序的交互。
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
        <!--zoomimageup-->
        <div id="zoomimageupInfo">
            <a href="zoomimageup/zoomimageup.html" target="_blank"><H4>ctp.ui.zoomimageup</H4></a>
            <a href="zoomimageup/zoomimageup.html" target="_blank">
                <P>
                </P>
            </a>
            <a href="#navhead">返回页首</a>
        </div>
    </body>
</html>
